<template>
  <div class="contact-component" :class="isTab ? 'hasTab':''">
    <div>
      <image @click="phone" src="../../static/images/phone.png"> </image>
    </div>

    <div >
      <image @click="openModal" src="../../static/images/message.png"> </image>
    </div>


    <div v-show="show">
      <order @hide="hideModal"> </order>
    </div>

  </div>
</template>

<script>
  import order from './order'
  export default {
    props : ['isTab'],
    data(){
      return{
        show : false
      }
    },
    components: {
      order,
    },

    methods:{
      phone(){
        wx.getStorage({
          key: 'base',
          success: function(res) {
            wx.makePhoneCall({
              phoneNumber: res.data.zixundianhua //仅为示例，并非真实的电话号码
            })
          }
        })

      },
      openModal(){
        this.show = true;
      },
      hideModal(){

        this.show = false;
      }
    }
  }
</script>
<style scoped>




  .contact-component{
    position: fixed;
    flex-direction: column;
    width: 100rpx;
    height: 220rpx;
    bottom: 0;
    right: 5rpx;
  }
  .contact-component.hasTab{
    bottom: 100rpx;
  }
  .contact-component image{
    width: 100rpx;
    height: 100rpx;
  }


</style>
